<template>
  <div class="content-wrapper">
    <!--  html  -->
    <!--Navbar-->
    <el-header style="padding:0">
      <Navbar />
    </el-header>
    <!--路由内容-->
    <el-main style="padding:0 20px 20px">
      <div class="scrollbar-main">
        <el-scrollbar style="height:100%" wrap-style="overflow-x:hidden;">
          <section>
            <keep-alive>
              <router-view v-if="$route.meta.keepAlive" />
            </keep-alive>
            <router-view v-if="!$route.meta.keepAlive" />
          </section>
        </el-scrollbar>
      </div>
    </el-main>

  </div>
</template>

<script>
import Navbar from './components/Navbar'

export default {
  components: {
    Navbar
  },
  data() {
    return {
      // 配置
      // 状态
      // 数据
    }
  },
  computed: {},
  watch: {},
  beforeCreate() {
  },
  created() {
  },
  beforeMount() {
  },
  mounted() {
    console.log(11111)
  },
  beforeUpdate() {
  },
  update() {
  },
  activated() {
  },
  deactivated() {
  },
  beforeDestroy() {
  },
  destroyed() {
  },
  methods: {
    /**
     * 数据组
     */
    /**
     * 按钮组
     */
    /**
     * 状态组
     */
    /**
     * 方法组
     */
  }
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.content-wrapper{
  width: 100%;
}
.el-header {
  position: relative;
  width: 100%;
  height: 60px;
}

.el-main {
  height: calc(100vh - 60px);
  overflow: hidden;
  .scrollbar-main{
    height: 100%;
    overflow: hidden;
    border-radius: 20px;
    background-color: #fff;
  }

}
</style>
